<template>
  <div id="order">
    <div class="nav">
      <span
        @click="$router.go(-1)"
        style="font-size: 0.36rem;font-weight: bold;color: #40404c;margin-right:.2rem;"
      >
        <van-icon name="arrow-left" />
      </span>
      <span @click="tabF(0)" :class="[zeroActive?'active':'']">{{$t('m.recharge')}}</span>
      <span @click="tabF(5)" :class="[fiveActive?'active':'']">{{$t('m.buy')}}</span>
      <!-- <span @click="tabF(3)" :class="[threeActive?'active':'']">{{$t('m.finances')}}</span> -->
      <span @click="tabF(1)" :class="[oneActive?'active':'']">{{$t('m.withdrawal')}}</span>
      <!-- <span @click="tabF(2)">{{$t('m.transfer')}}</span>
      <span @click="tabF(4)">{{$t('m.freed')}}</span>-->
      <span @click="tabF(6)" :class="[sixActive?'active':'']">{{$t('m.reward3')}}</span>
      <span @click="tabF(7)" :class="[sevenActive?'active':'']">{{$t('m.reward4')}}</span>
      <span @click="tabF(8)" :class="[eightActive?'active':'']">{{$t('m.reward5')}}</span>
      <!-- <span :class="[showList==0?'active':'']" @click="tab(0)">{{$t("m.all")}}</span> -->
      <!-- <span
        :class="[showList==item.dictSort?'active':'']"
        @click="tab(item.dictSort)"
        v-for="(item,index) in typeList"
        :key="index"
      >{{item.dictLabel}}</span>-->
    </div>
    <div class="rootMain">
      <Scroll :on-refresh="onRefresh" :on-infinite="onInfinite">
        <div class="scroll-box">
          <div :class="['top', $store.state.scrollTop > 0 ?'fixedHeader':'']">
            <div class="order">
              <div class="fatherTab">
                <!-- <div class="scrollList" v-show="scrollList">
                  <div>
                    <span @click="tabF(0)">{{$t('m.recharge')}}</span>
                    <span @click="tabF(5)">{{$t('m.buy')}}</span>
                    <span @click="tabF(3)">{{$t('m.finances')}}</span>
                    <span @click="tabF(1)">{{$t('m.withdrawal')}}</span>
                    <span @click="tabF(2)">{{$t('m.transfer')}}</span>
                    <span @click="tabF(4)">{{$t('m.freed')}}</span>
                    <span @click="tabF(6)" v-if="grounp == 1">{{$t('m.reward1')}}</span>
                    <span @click="tabF(7)" v-if="grounp != 3">{{$t('m.reward2')}}</span>
                  </div>
                </div>-->
                <!-- <div class="tabs zeroActive">
                  <span>{{titleVal}}</span>
                  <span @click="tabF(5)">{{$t('m.buy')}}</span>
                  <span @click="tabF(3)">{{$t('m.finances')}}</span>
                  <span @click="tabF(1)">{{$t('m.withdrawal')}}</span>
                  <span @click="tabF(2)">{{$t('m.transfer')}}</span>
                  <span @click="tabF(4)">{{$t('m.freed')}}</span>
                  <i @click="scroll_R" class="iconfont icon-more1-vertical scrollR"></i>
                </div>-->
                <div class="title">
                  <ul class="header" v-if="zeroActive">
                    <li>{{$t('m.fundName1')}}</li>
                    <li>{{$t('m.rechargeAmount')}}</li>
                    <li>{{$t('m.rechargeTime')}}</li>
                    <li>{{$t('m.status')}}</li>
                  </ul>
                  <ul class="header" v-else-if="oneActive">
                    <li>{{$t('m.fundName')}}</li>
                    <li>{{$t('m.withdrawalAmount')}}</li>
                    <li>{{$t('m.withdrawalTime')}}</li>
                    <li>{{$t('m.status')}}</li>
                  </ul>
                  <ul class="header" v-else-if="threeActive">
                    <li>{{$t('m.fundName1')}}</li>
                    <li>{{$t('m.buyAmount')}}</li>
                    <li>{{$t('m.buyTime')}}</li>
                    <li>{{$t('m.status')}}</li>
                  </ul>
                  <ul class="header" v-else-if="twoActive">
                    <li>{{$t('m.fundName')}}</li>
                    <li>{{$t('m.transferAccount')}}</li>
                    <li>{{$t('m.transferAmount')}}</li>
                    <li>{{$t('m.transferTime')}}</li>
                  </ul>
                  <ul class="header" v-else-if="fourActive">
                    <li>{{$t('m.fundName')}}</li>
                    <li>{{$t('m.releasePercentage')}}</li>
                    <li>{{$t('m.releaseQuantity')}}</li>
                    <li>{{$t('m.unitPrice')}}</li>
                    <li>{{$t('m.releaseTime')}}</li>
                  </ul>
                  <ul class="header" v-else-if="fiveActive">
                    <li>{{$t('m.buyAmount')}}</li>
                    <li>{{$t('m.buyTime')}}</li>
                    <li>{{$t('m.status')}}</li>
                    <li>{{$t('m.VCcoins')}}</li>
                  </ul>
                  <ul class="header" v-else-if="sixActive">
                    <li>{{$t('m.fundName1')}}</li>
                    <li>{{$t('m.rewardAmount')}}</li>
                    <li>{{$t('m.rewardTime')}}</li>
                    <li>{{$t('m.status')}}</li>
                  </ul>
                  <ul class="header" v-else-if="sevenActive">
                    <li>{{$t('m.fundName1')}}</li>
                    <li>{{$t('m.rewardAmount')}}</li>
                    <li>{{$t('m.rewardTime')}}</li>
                    <li>{{$t('m.status')}}</li>
                  </ul>
                   <!--<ul class="header" v-else-if="eightActive">
                    <li>{{$t('m.fundName1')}}</li>
                    <li>{{$t('m.rewardAmount')}}</li>
                    <li>{{$t('m.rewardTime')}}</li>
                    <li>{{$t('m.status')}}</li>
                  </ul>-->
                </div>
                <!-- 充值 -->
                <div class="list" v-if="zeroActive">
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div class="item" v-for="(item,index) in listData" :key="index">
                      <span>CNN</span>
                      <span>{{item.amount}}</span>
                      <span>
                        <label>{{item.createTime}}</label>
                      </span>
                      <span v-if='item.rechargeStatus==1'>处理中</span>
                      <span v-if='item.rechargeStatus==2'>充值成功</span>
                      <span v-if='item.rechargeStatus==3'>充值失败</span>
                     
                    </div>
                  </van-list>
                </div>
                <!-- 提币 -->
                <div class="list" v-else-if="oneActive">
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div
                      class="item"
                      v-for="(item,index) in listData1"
                      :key="index"
                      @click="goDetail(item,item.id)"
                    >
                      <span v-if="item.amountType==1">CNN{{$t('m.withdraw')}}</span>
                      <span v-else-if="item.amountType==2">VC{{$t('m.withdrawal')}}</span>
                      <span v-else>VC{{$t("m.finances")}}</span>
                      <span>{{item.actualAmount}}</span>
                      <span>
                        <label>{{item.withdrawTime}}</label>
                      </span>
                      <span v-if="item.withdrawStatus==1">{{$t('m.successT')}}</span>
                      <span v-else-if="item.withdrawStatus==2">{{$t('m.errorT')}}</span>
                      <span v-else>{{$t('m.processing')}}</span>
                    </div>
                  </van-list>
                </div>
                <!-- 划转/入账 统一到划转 -->
                <div class="list" v-else-if="twoActive">
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div
                      class="item"
                      v-for="(item,index) in listData2"
                      :key="index"
                      @click="goDetail(item,item.id)"
                    >
                      <span v-if="item.amountType == 1">GCC</span>
                      <span v-else>USDT</span>
                      <span>
                        {{(item.coverTransactionUserName).replace(
                        item.coverTransactionUserName.substr(3, 4),
                        "****"
                        )}}
                      </span>
                      <span v-if="item.status==0">-{{item.txnAmount}}</span>
                      <span v-else>+{{item.txnAmount}}</span>
                      <span>
                        <label>{{item.createTime}}</label>
                      </span>
                    </div>
                  </van-list>
                </div>
                <!-- 理财 -->
                <div class="list" v-else-if="threeActive">
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div class="item" v-for="(item,index) in listData3" :key="index">
                      <span>
                        <label>{{$t('m.financialProduct')}}</label>
                      </span>
                      <span>{{item.usdtAmount}}</span>
                      <span>
                        <label>{{item.createTime}}</label>
                      </span>
                      <span v-if="item.releaseFlag==0">
                        <label>{{$t('m.buySuccess')}}</label>
                      </span>
                      <span v-else>
                        <label>{{$t('m.redeem')}}</label>
                      </span>
                    </div>
                  </van-list>
                </div>
                <!-- 释放 -->
                <div class="list" v-else-if="fourActive">
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div class="item" v-for="(item,index) in listData4" :key="index">
                      <span>GCC</span>
                      <span>{{item.amount}}%</span>
                      <span>
                        <label>{{item.gccAmount}}</label>
                      </span>
                      <span>{{(item.actualAmount/item.gccAmount).toFixed(3)}}</span>
                      <span>
                        <label>{{item.actualDay}}</label>
                      </span>
                    </div>
                  </van-list>
                </div>
                <!-- 购买 -->
                <div class="list" v-else-if="fiveActive">
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div class="item" v-for="(item,index) in listData5" :key="index">
                      <span>{{item.amount}} CNN</span>
                      <span>
                        <label>{{item.createTime}}</label>
                      </span>
                      <span>{{$t('m.success2')}}</span>
                      <span>{{item.vcAmount}}</span>
                    </div>
                  </van-list>
                </div>
                <!-- 直推奖励 -->
                <div class="list" v-else-if="sixActive">
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div class="item" v-for="(item,index) in listData6" :key="index">
                      <span>
                        <label>{{item.txnDesc}}</label>
                      </span>
                      <span>
                        <label>{{item.txnAmount}} CNN</label>
                      </span>
                      <span>
                        <label>{{item.createTime}}</label>
                      </span>
                      <span>{{$t('m.successT')}}</span>
                    </div>
                  </van-list>
                </div>
                <!-- 团队奖励 -->
                <div class="list" v-else-if="sevenActive">
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div class="item" v-for="(item,index) in listData7" :key="index">
                      <span>
                        <label>{{item.txnDesc}}</label>
                      </span>
                      <span>
                        <label>{{item.txnAmount}} CNN</label>
                      </span>
                      <span>
                        <label>{{item.createTime}}</label>
                      </span>
                      <span>{{$t('m.successT')}}</span>
                    </div>
                  </van-list>
                </div>
                 <!-- 基金划转 -->
                <div class="list list_8" v-else>
                  <van-list
                    v-model="loading"
                    :finished-text="$t('m.noMore')"
                    :loading-text="$t('m.loading')"
                    :offset="100"
                    :finished="finished"
                    @load="onLoad"
                  >
                    <div class="every" v-for="(item,index) in listData8" :key="index">
                    <!--<div class="every" >-->
                      <div class="box_1">
                        <span>
                          <label>
                            <span v-if='item.fromType==1'>可用余额</span>
                            <span v-if='item.fromType==2'>可提资产</span>
                            <span v-if='item.fromType==3'>理财资产</span>
                            <span v-if='item.fromType==5'>可提资产</span>
                            <span v-if='item.fromType==8'>基金资产</span>
                            <span>-转出到</span>
                            <span v-if='item.toType==1'>可用余额</span>
                            <span v-if='item.toType==2'>可提资产</span>
                            <span v-if='item.toType==3'>理财资产</span>
                            <span v-if='item.toType==5'>可提资产</span>
                            <span v-if='item.toType==8'>基金资产</span>                  
                          </label>
                        </span>
                        <span>
                          <label>
                            {{item.amount}} 
                            <span v-if='item.fromType==1||item.fromType==5'>CNN</span>
                            <span v-if='item.fromType==2||item.fromType==3||item.fromType==8'>VC</span>
                          </label>
                        </span>
                      </div>
                      <div class="time">{{item.createTime}}</div>
                    </div>
                   
                   
                  </van-list>
                </div>

              </div>
              <!-- end -->
            </div>
          </div>
        </div>
      </Scroll>
    </div>
    <!-- <Footer></Footer> -->
  </div>
</template>
<script>
import Services from "@/service/index.js";
import { mapMutations, mapState } from "vuex";
import Header from "@/components/header";
import Footer from "@/components/footer";
import Scroll from "@/components/scroll";
import { Toast, PullRefresh } from "vant";
export default {
  data() {
    return {
      loginToken: "",
      typeList: [
        {
          dictLabel: "测试测试"
        },
        {
          dictLabel: "测试专用"
        },
        {
          dictLabel: "测试文本"
        }
      ],
      // end
      fatherActive: 0,
      childActive: 0,
      listData: [],
      listData1: [],
      listData2: [],
      // listData3: [],
      listData4: [],
      listData5: [],
      listData6: [],
      listData7: [],
      listData8: [],
      loading: false,
      finished: false,
      currentPage: 0,
      total: 0,
      pageNum: 0,
      pageSize: 10,
      flag: false,
      zeroActive: true,
      oneActive: false,
      twoActive: false,
      threeActive: false,
      fourActive: false,
      fiveActive: false,
      sixActive: false,
      sevenActive: false,
      eightActive: false,
      scrollL: false,
      scrollR: true,
      scrollW: 0,
      show: true,
      scrollList: false,
      titleVal: "",
      grounp: 1 //判断是团队用户还是正常用户  1是正常用户 2是团队长 3是团队成员
    };
  },
  created() {
    // this.changeTitle("GCC");
    // this.changetabbarIndex(3);
    let from=this.$route.query.from;
    if(from=='recharge'){
      sessionStorage.setItem("fatherActive" ,0)
      this.fatherActive=0;
    }
    console.log(this.$route.query.from)
    this.loginToken = localStorage.getItem("token")
      ? localStorage.getItem("token")
      : "";
    this.scrollW = document.body.clientWidth;
    this.titleVal = this.$t("m.recharge");
    Services.getUser({
      token: this.loginToken,
      lang: localStorage.getItem("language")
    }).then(res => {
      if (res.code == "0000") {
        if (res.user.vUser == 1 && res.vLeader != 1) {
          this.grounp = 2;
        } else {
          if (res.vLeader == 1) {
            this.grounp = 3;
          } else {
            this.grounp = 1;
          }
        }
        localStorage.setItem("userObj", JSON.stringify(res.user));
      } else {
      }
    });
    this.fatherActive = sessionStorage.getItem("fatherActive") || 0;
    this.tabF(this.fatherActive);
  },
  components: {
    Scroll,
    Header,
    Footer
  },
  computed: {
    ...mapState({})
  },
  methods: {
    ...mapMutations(["changeTitle", "changetabbarIndex"]),
    // 左右滑动
    // scrollX(ev) {
    //   console.log(ev);
    //   console.log(ev.target.scrollWidth);
    //   console.log(ev.target.scrollLeft);

    //   if (ev.target.scrollLeft > 0) {
    //     this.scrollL = true;
    //   } else {
    //     this.scrollL = false;
    //   }
    //   if (
    //     ev.target.scrollLeft <
    //     ev.target.scrollWidth - ev.target.clientWidth
    //   ) {
    //     this.scrollR = true;
    //   } else {
    //     this.scrollR = false;
    //   }
    // },
    // scroll_L() {
    //   this.$refs.scrollDiv.scrollLeft = 0;
    // },
    scroll_R() {
      this.scrollList = !this.scrollList;
    },
    tabF(index) {
      if (index == 0) {
        this.titleVal = this.$t("m.recharge");
        this.zeroActive = true;
        this.oneActive = false;
        this.twoActive = false;
        this.threeActive = false;
        this.fourActive = false;
        this.fiveActive = false;
        this.sixActive = false;
        this.sevenActive = false;
        this.eightActive = false;
        this.fatherActive = 0;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData = [];
      } else if (index == 1) {
        this.titleVal = this.$t("m.withdrawal");
        this.zeroActive = false;
        this.oneActive = true;
        this.twoActive = false;
        this.threeActive = false;
        this.fourActive = false;
        this.fiveActive = false;
        this.sixActive = false;
        this.sevenActive = false;
        this.eightActive = false;
        this.fatherActive = 1;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData1 = [];
      } else if (index == 2) {
        this.titleVal = this.$t("m.transfer");
        this.zeroActive = false;
        this.oneActive = false;
        this.twoActive = true;
        this.threeActive = false;
        this.fourActive = false;
        this.fiveActive = false;
        this.sixActive = false;
        this.sevenActive = false;
        this.eightActive = false;
        this.fatherActive = 2;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData2 = [];
      } else if (index == 3) {
        this.titleVal = this.$t("m.finances");
        this.zeroActive = false;
        this.oneActive = false;
        this.twoActive = false;
        this.threeActive = true;
        this.fourActive = false;
        this.fiveActive = false;
        this.sixActive = false;
        this.sevenActive = false;
        this.eightActive = false;
        this.fatherActive = 3;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData3 = [];
      } else if (index == 4) {
        this.titleVal = this.$t("m.freed");
        this.zeroActive = false;
        this.oneActive = false;
        this.twoActive = false;
        this.threeActive = false;
        this.fourActive = true;
        this.fiveActive = false;
        this.sixActive = false;
        this.sevenActive = false;
        this.eightActive = false;
        this.fatherActive = 4;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData4 = [];
      } else if (index == 5) {
        this.titleVal = this.$t("m.buy");
        this.zeroActive = false;
        this.oneActive = false;
        this.twoActive = false;
        this.threeActive = false;
        this.fourActive = false;
        this.fiveActive = true;
        this.sixActive = false;
        this.sevenActive = false;
        this.eightActive = false;
        this.fatherActive = 5;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData5 = [];
      } else if (index == 6) {
        this.titleVal = this.$t("m.reward1");
        this.zeroActive = false;
        this.oneActive = false;
        this.twoActive = false;
        this.threeActive = false;
        this.fourActive = false;
        this.fiveActive = false;
        this.sixActive = true;
        this.sevenActive = false;
        this.eightActive = false;
        this.fatherActive = 6;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData6 = [];
      } else if (index == 7){
        this.titleVal = this.$t("m.reward2");
        this.zeroActive = false;
        this.oneActive = false;
        this.twoActive = false;
        this.threeActive = false;
        this.fourActive = false;
        this.fiveActive = false;
        this.sixActive = false;
        this.sevenActive = true;
        this.eightActive = false;
        this.fatherActive = 7;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData7 = [];
      }else{
        this.titleVal = this.$t("m.reward2");
        this.zeroActive = false;
        this.oneActive = false;
        this.twoActive = false;
        this.threeActive = false;
        this.fourActive = false;
        this.fiveActive = false;
        this.sixActive = false;
        this.sevenActive = false;
        this.eightActive = true;
        this.fatherActive = 8;
        this.pageNum = 0;
        this.total = 0;
        this.loading = true;
        this.finished = false;
        this.listData8 = [];
      }
      sessionStorage.setItem("fatherActive", this.fatherActive);
      this.getRecord();
      this.scrollList = false;
    },
    // 下拉刷新 deling 00
    onRefresh(done) {
      this.pageNum = 0;
      setTimeout(() => {
        done();
        this.listData = [];
        this.listData1 = [];
        this.listData2 = [];
        this.listData3 = [];
        this.listData4 = [];
        this.listData5 = [];
        this.listData6 = [];
        this.listData7 = [];
        this.listData8 = [];
        Toast(this.$t("m.refresh"));
        this.finished = false;
        this.getRecord();
      }, 500);
    },
    onInfinite(done) {
      setTimeout(() => {
        done(0);
      });
    },
    // end
    onLoad(type) {
      setTimeout(() => {
        // 加载状态结束
        if (this.pageNum != 0 && this.pageNum * 10 >= this.total) {
          this.finished = true;
          return;
        }
        this.getRecord();
      }, 500);
    },
    //获取列表
    getRecord() {
      this.pageNum = this.pageNum + 1;
      if (this.fatherActive == 0) {
        //充值记录
        Services.getTxnList(this.loginToken, {
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          lang: localStorage.getItem("language")
        }).then(res => {
          if (res.code == "0000") {
            this.listData = this.listData.concat(res.list);
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.finished = true;
            this.loading = false;
            Toast(res.msg);
          }
        });
      } else if (this.fatherActive == 1) {
        //提币记录
        Services.getWithdraws(this.loginToken, {
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          lang: localStorage.getItem("language")
        }).then(res => {
          if (res.code == "0000") {
            this.listData1 = this.listData1.concat(res.list);
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.loading = false;
            this.finished = true;
            Toast(res.msg);
          }
        });
      } else if (this.fatherActive == 2) {
        // 划转记录
        Services.getWdyTransferPoints({
          token: this.loginToken,
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          lang: localStorage.getItem("language")
        }).then(res => {
          if (res.code == "0000") {
            this.listData2 = this.listData2.concat(res.list);
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.loading = false;
            this.finished = true;
            Toast(res.msg);
          }
        });
      } else if (this.fatherActive == 3) {
        // 理财记录
        Services.getWdyUsdtOrderRecord({
          token: this.loginToken,
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          lang: localStorage.getItem("language")
        }).then(res => {
          if (res.code == "0000") {
            this.listData3 = this.listData3.concat(res.list);
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.loading = false;
            this.finished = true;
            Toast(res.msg);
          }
        });
      } else if (this.fatherActive == 4) {
        // 释放
        Services.getReleaseCoinPlanList({
          token: this.loginToken,
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          lang: localStorage.getItem("language")
        }).then(res => {
          console.log(res);
          if (res.code == "0000") {
            this.listData4 = this.listData4.concat(res.list);
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.loading = false;
            this.finished = true;
            Toast(res.msg);
          }
        });
      } else if (this.fatherActive == 5) {
        // 购买
        Services.getVcBuyOrderList({
          token: this.loginToken,
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          lang: localStorage.getItem("language")
        }).then(res => {
          if (res.code == "0000") {
            this.listData5 = this.listData5.concat(res.list);
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.loading = false;
            this.finished = true;
            Toast(res.msg);
          }
        });
      } else if (this.fatherActive == 6) {
        // 充值奖励
        Services.getTxnHistorysByType({
          token: this.loginToken,
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          txnType: 13,
          lang: localStorage.getItem("language")
        }).then(res => {
          if (res.code == "0000") {
            this.listData6 = this.listData6.concat(res.list);
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.loading = false;
            this.finished = true;
            Toast(res.msg);
          }
        });
      } else if (this.fatherActive == 7){
        // 理财奖励
        Services.getTxnHistorysByType({
          token: this.loginToken,
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          txnType: 14,
          lang: localStorage.getItem("language")
        }).then(res => {
          if (res.code == "0000") {
            this.listData7 = this.listData7.concat(res.list);
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.loading = false;
            this.finished = true;
            Toast(res.msg);
          }
        });
      }else{
        // 资产划转
        Services.getTransferList({
          token: this.loginToken,
          pageNum: this.pageNum,
          pageSize: this.pageSize,
        }).then(res => {
          if (res.code == "0000") {
            this.listData8 = this.listData8.concat(res.list);
            // console.log(listData8 )
            this.total = res.page.total;
            this.loading = false;
            if (this.pageNum * 10 >= this.total) {
              this.finished = true;
            }
          } else {
            this.loading = false;
            this.finished = true;
            Toast(res.msg);
          }
        });
      }
    },
    // 跳转到详情
    goDetail(item, id) {
      sessionStorage.setItem("detailData", JSON.stringify(item));
      sessionStorage.setItem("fatherActive", this.fatherActive);
      // this.$router.push(`/orderDetail`);
      this.$router.push(`/orderDetail?id=${id}&active=${this.fatherActive}`);
    }
  }
};
</script>
<style lang="scss" scoped type="text/scss">
#order {
  height: 100%;
  .nav {
    padding: 0 0.3rem;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0.88rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    background: #fff;
    box-shadow: 0 0.05rem 0.1rem rgba(0, 0, 0, 0.07);
    z-index: 999;
    span {
      display: flex;
      justify-content: center;
      align-items: center;
      color: #a8a7ab;
      font-size: 0.22rem;
      height: 100%;
      letter-spacing: 0.02rem;
      padding: 0 0.1rem;
      position: relative;
      &.active {
        font-size: 0.3rem;
        font-weight: bold;
        color: #40404c;
        &::after {
          content: "";
          display: block;
          position: absolute;
          bottom: 0;
          left: 50%;
          transform: translateX(-50%);
          width: 0.5rem;
          height: 0.05rem;
          background: #e4b577;
        }
      }
    }
  }
  .rootMain {
    height: calc(100% - 0.88rem);
    top: 0.88rem;
  }
  .order {
    .fatherTab {
      min-height: calc(100vh - 0.88rem);
      padding: 0;
      position: relative;

      .title {
        > ul {
          display: flex;
          justify-content: space-around;
          align-items: center;
          li {
            display: flex;
            align-items: center;
            justify-content: center;
            height: 0.97rem;
            width: 20%;
            font-size: 0.26rem;
            font-weight: bold;
            text-align: center;
          }
        }
      }
      .list {
        .item {
          width: 100%;
          height: 1rem;
          line-height: 1rem;
          font-size: 0.24rem;
          color: #40404c;
          font-weight: normal;
          display: flex;
          justify-content: space-around;
          align-items: center;
          &:nth-of-type(2n-1) {
            background: #f8f8f8;
          }
          span {
            width: 20%;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            label {
              line-height: 1.2;
              text-align: center;
            }
          }
        }
      }
      >.list_8{
        .every{
          padding: .28rem .5rem;
          >.box_1 {
              span{
                  font-size: 0.24rem;
                  color: #40404c;                
              }
              >span:nth-of-type(2){
                float: right;
              }
          }
          >.time{
            margin-top: .14rem;
            font-size: 0.24rem;
            color: #40404c;
          }
          
        }
        .every:nth-of-type(2n-1) {
          background: #f8f8f8;
        }
       
      }
    }
  }
  .cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
</style>
<style lang="scss">
#order {
  .order {
    .childTab .van-tabs__nav {
      background: transparent;
    }

    .van-tabs--card > .van-tabs__wrap {
      height: 0.67rem;
    }
    .van-tabs__nav {
      overflow: hidden;
      overflow-x: auto;
    }
    .van-tabs__nav--card {
      height: 0.67rem;
      border: none;
      margin: 0;
      background: transparent;
      .vant-tab {
        color: #c0c1c4;
      }
    }
    .van-tabs__nav--card .van-tab.van-tab--active {
      color: #fff;
      background: transparent;
      // background: url("~@/assets/img/new/titleBg@2x.png") no-repeat center /
      //   100% 100%;
    }
    #order .order .van-tabs__nav--card {
      width: 100%;
    }
    .van-tabs__nav--card .van-tab {
      color: #c0c1c4;
      border: none;
      padding: 0;
      // min-width: 33.333333%;
      width: 20%;
      &:nth-of-type(2n) {
        background: url("~@/assets/img/new/titleBg2@2x.png") no-repeat center /
          100% 100%;
        width: 40% !important;
      }
      span {
        background: transparent;
        line-height: 0.67rem;
      }
    }
  }
}
</style>